<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<p>
    <span style="vertical-align: middle">设备编号：</span>
    <textarea id="txaId" cols="30" rows="5" style="vertical-align: middle">100016243</textarea>
</p>
<p style="clear: both"></p>
<fieldset>
    <legend>mqtt消息</legend>

    <span style="vertical-align: middle">消息内容:</span>
    <textarea name="" id="txaVal" cols="100" rows="18" style="vertical-align: middle">
[
  {
    "msg_type": "control",
    "msg_id": 63,
    "msg_uri": "1535727965-cTPPdiiiSumT-msg_uri",
    "operation": "add",
    "life": {
      "expire": "",
      "type": "forever"
    },
    "msg_data": {
      "type": "lighting",
      "value": "on/off"
    },
    "receiver": "100016243",
    "create_time": 1535727966,
    "sender": "admin"
  }
]
    </textarea>
    <br/>

    <p style="text-align: center">

        <input type="button" value="发送" style="width: 80%" id="btnSend"/>
    </p>
</fieldset>
<div>
    <label for="">温度控制(单位摄氏度，范围：-30~100)</label>
    <pre>
[
  {
    "msg_type": "control",
    "msg_id": 63,
    "msg_uri": "1535727965-cTPPdiiiSumT-msg_uri",
    "operation": "add",
    "life": {
      "expire": "",
      "type": "forever"
    },
    "msg_data": {
      "type": "temperature",
      "value": "17"
    },
    "receiver": "100016243",
    "create_time": 1535727966,
    "sender": "admin"
  }
]
    </pre>
</div>
<div>
    <label for="">风干（on为开，off为关）</label>
    <pre>
[
  {
    "msg_type": "control",
    "msg_id": 63,
    "msg_uri": "1535727965-cTPPdiiiSumT-msg_uri",
    "operation": "add",
    "life": {
      "expire": "",
      "type": "forever"
    },
    "msg_data": {
      "type": "air-dry",
      "value": "on"
    },
    "receiver": "100016243",
    "create_time": 1535727966,
    "sender": "admin"
  }
]
    </pre>
</div>
<div>
    <label for="">灯光照明（on为开，off为关）</label>
    <pre>
[
  {
    "msg_type": "control",
    "msg_id": 63,
    "msg_uri": "1535727965-cTPPdiiiSumT-msg_uri",
    "operation": "add",
    "life": {
      "expire": "",
      "type": "forever"
    },
    "msg_data": {
      "type": "lighting",
      "value": "on"
    },
    "receiver": "100016243",
    "create_time": 1535727966,
    "sender": "admin"
  }
]
    </pre>
</div>
<div>
    <label for="">音量控制（单位百分比，范围0~100）</label>
    <pre>
[
  {
    "msg_type": "control",
    "msg_id": 63,
    "msg_uri": "1535727965-cTPPdiiiSumT-msg_uri",
    "operation": "add",
    "life": {
      "expire": "",
      "type": "forever"
    },
    "msg_data": {
      "type": "volume",
      "value": "60"
    },
    "receiver": "100016243",
    "create_time": 1535727966,
    "sender": "admin"
  }
]
    </pre>
</div>
<div>
    <label for="">WIFI设置</label>
    <pre>
[
  {
    "msg_type": "control",
    "msg_id": 63,
    "msg_uri": "1535727965-cTPPdiiiSumT-msg_uri",
    "operation": "add",
    "life": {
      "expire": "",
      "type": "forever"
    },
    "msg_data": {
      "type": "wifi",
      "name": "mywife",
      "password": "12345678"
    },
    "receiver": "100016243",
    "create_time": 1535727966,
    "sender": "admin"
  }
]
    </pre>
</div>
<script type="text/javascript"
        src="/static/lib/jquery-1.11.1.js"></script>

<script type="text/javascript">

    $(function () {
        $("#btnSend").bind("click", function () {
            var deviceId = $.trim($("#txaId").val());
            if (!/^\s*$/gi.test(deviceId)) {
                commit(deviceId, 'message', $.trim($('#txaVal').val()));
            }
            else {
                alert("请输入要推送的设备编号")
            }
        })
    })

    function commit(id, type, value) {
        $.ajax({
            url: location.href,
            type: "POST",
            data: {
                "device_id": id,
                "type": type,
                "message": value
            },
            dataType: "json",
            success: function (res) {
                if (res.code == 0) {
                    console.log("成功");
                } else {
                    alert(res.msg);
                }
            }
        });
    }
</script>

</body>
</html>